<script setup lang="ts">
/**
 * @name RosteringPlan
 * @description 排班计划
 */
import { SearchForm } from './components'
import { defaultPagingParams } from './index'

import {
  exportSchedulingPlanData,
  selectSchedulingPlanPage,
} from '@/api/modules/scheduling'
// ------------------use------------------
// #region
const { form } = useKeepPageStore()
form(['/shift-scheduling-scheme'])
const { withLoading, loading } = useDefineLoading()
const [tableData, setTableData] = useState<any[]>([])
const [total, setTotal] = useState<number>(0)
const [columns, setColumns] = useState([])

// #endregion
// ------------------静态变量------------------
// #region
// #endregion
// ------------------动态变量------------------
// #region

// #endregion
// ------------------ref-----------
// #region
const pagingParams = ref({
  ...defaultPagingParams,
})
// #endregion
// ------------------reactive------
// #region

// #endregion
// ------------------computed------
// #region
// #endregion
// ------------------生命周期------------------
// #region
onBeforeMount(() => {
  getTableData()
})
// #endregion
// ------------------内置方法---------------------
// #region

// #endregion
// ------------------方法---------------------
// #region
function handleDownload() {
  exportSchedulingPlanData({
    startTime: pagingParams.value.startTime,
    endTime: pagingParams.value.endTime,
  })
}
async function getTableData() {
  const { data: res } = await withLoading(
    selectSchedulingPlanPage,
  )(pagingParams.value)
  const { total, records } = res.pageData
  if (!res.teamNameList) {
    setColumns([])
    setTotal(0)
    setTableData([])
    return
  }
  const arr: any[] = []
  const keys: string[] = []
  const cols = [
    {
      key: uuid(),
      type: 'index',
      width: '80',
      label: '序号',
    },
    {
      key: uuid(),
      label: '值班日期',
      prop: 'time',
    },
  ];
  (res.teamNameList as string[]).forEach((name) => {
    const key = uuid()
    const column = {
      key,
      label: name,
      prop: key,
    }
    keys.push(key)
    cols.push(column)
  });
  (records as any[]).forEach((item) => {
    const o: Record<string, string> = {
      time: formatTime(item.schedulingDate, 'YYYY-MM-DD'),
    }
    keys.forEach((key, i) => {
      o[key] = item.shiftList[i]
    })
    arr.push(o)
  })

  setColumns(cols as any)
  setTotal(total)
  setTableData(arr)
}
// #endregion
</script>

<template>
  <div
    class="padding-sm flex-direction flex align-end container"
  >
    <view-table
      :loading="loading"
      :columns="columns"
      :data="tableData"
      custom-download
      @download="handleDownload"
    >
      <template #actions>
        <SearchForm
          v-model="pagingParams"
          @search="getTableData"
          @reset="getTableData"
        />
      </template>
    </view-table>

    <!-- 分页 -->
    <ListsPagination
      v-model:page-num="pagingParams.pageNumber"
      v-model:page-size="pagingParams.pageSize"
      :total="total"
      @current-change="getTableData"
      @size-change="getTableData"
    />
  </div>
</template>

<style lang="scss" scoped>
//------------------组件样式------------------
//-------------样式穿透-------------
</style>
